<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8"/>
    <title></title>
    <meta name="renderer" content="webkit"/>
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1"/>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0"/>
    <link rel="stylesheet" href="/layuiadmin/layui/css/layui.css" media="all"/>
    <link rel="stylesheet" href="/layuiadmin/style/admin.css" media="all"/>
    <script src="/static/jquery.min.js"></script>
    <style>
        .layui-form-item .layui-input-inline {
            width: 150px;
        }
        .layui-form-label {
            padding: 9px 5px;
            width: auto;
        }
        .myTable{
            background-color: #f8f8f8;
        }
        .myTable td{
            /**color: #ffffff;**/
        }

        #orderidlist>.myTable:hover{
            background-color: #f8f8f8;
        }
    </style>
</head>
<body>
<div class="layui-fluid">
    <div class="layui-card">
        <form class="layui-form layui-col-space5" id="sbumitForm">
            <div class="layui-form layui-card-header layuiadmin-card-header-auto">
                <div class="layui-form-item">
                    <div class="layui-inline ">
                        <label class="layui-form-label">申请人</label>
                        <div class="layui-input-inline">
                            <input type="text" name="anchor_id" placeholder="按用申请人ID" autocomplete="off" class="layui-input"/>
                        </div>
                    </div>
                    <div class="layui-inline ">
                        <label class="layui-form-label">申请时间</label>
                        <div class="layui-input-inline" STYLE="width: 110px">
                            <input type="text" name="start_date" class="layui-input" id="start_date" readonly placeholder="开始日期">
                        </div>
                        <div class="layui-input-inline" id="maindiv" STYLE="width: 110px">
                            <input type="text" name="end_date" class="layui-input" id="end_date" readonly placeholder="结束日期">
                        </div>
                    </div>
                    <div class="layui-inline ">
                        <label class="layui-form-label">竞猜状态</label>
                        <div class="layui-input-inline" style="width: 120px">
                            <select name="status" lay-filter="status">
                                <option value="">全部</option>
                                <option value="1">待审核</option>
                                <option value="2">已审核</option>
                                <option value="3">已拒绝</option>
                                <option value="4">已删除</option>
                            </select>
                        </div>
                    </div>

                    <div class="layui-inline ">
                        <div class="layui-input-inline" style="width: 120px">
                            <select name="refresh" lay-filter="refresh">
                                <option value="">选择刷新</option>
                                <option value="15">15秒</option>
                                <option value="30">30秒</option>
                                <option value="60">一分钟</option>
                                <option value="120">二分钟</option>
                                <option value="300">五分钟</option>
                            </select>
                        </div>
                    </div>
                    <div class="layui-inline ">
                        <div class="layui-input-inline" style="width: 100px">
                            <select name="yuyin" lay-filter="yuyin">
                                <option value="0">关闭语音</option>
                                <option value="1">开启语音</option>
                            </select>
                        </div>
                    </div>
                    <div class="layui-inline ">
                        <div class="layui-input-inline">
                            <div class="layui-btn" id="submit">
                                <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="layui-card-body layui-table-body layui-table-main">
                <table class="layui-table layui-form" style="table-layout:fixed">
                    <thead>
                    <tr>
                        <th style="width:30px;text-align:center;font-size: 13px" >序号</th>
                        <th style="text-align:center;width:100px;font-size: 13px" >申请时间</th>
                        <th style="text-align:center;width:100px;font-size: 13px">申请人</th>
                        <th style="text-align:center;width:200px;font-size: 13px">预设问题/选项</th>
                        <th style="text-align:center;width:100px;font-size: 13px">关联直播分类</th>
                        <th style="text-align:center;width:60px;font-size: 13px">最小投注</th>
                        <th style="text-align:center;width:60px;font-size: 13px">状态</strong></th>
                        <th style="text-align:center;width:200px;font-size: 13px">审核意见</th>
                        <th style="text-align:center;width:100px;font-size: 13px">审核人</th>
                        <th style="text-align:center;width:100px;font-size: 13px">
                            操作
                        </th>
                    </tr>
                    </thead>
                    <tbody id="orderidlist">
                    <tr>
                        <td colspan="10" style="text-align: center;color:red;font-size:16px">查询中...</td>
                    </tr>
                    </tbody>
                </table>
            </div>
            <div class="layui-card-body" style="margin-bottom:30px">
                <div>
                    <div id="pageHtml">

                    </div>
                </div>
            </div>
        </form>
    </div>
</div>
</body>

<script src="/layuiadmin/layui/layui.js"></script>
<script>
    var crontable_id = 0;
    var yuyin = 0;
    layui.use(['form', 'table', 'laydate'], function () {
        $ = layui.jquery;
        var form = layui.form;
        var table = layui.table;
        var laydate = layui.laydate;
        laydate.render({
            elem: '#start_date', //指定元素
            max: '<?php echo date("Y-m-d");?>',
            done: function (value, date, endDate) { //控件选择完毕后的回调---点击日期、清空、现在、确定均会触发。
                $("#maindiv").empty();
                $("#maindiv").append('<input type="text" type="text" name="end_date" class="layui-input"  id="end_date" readonly  placeholder="结束日期" />');
                laydate.render({
                    elem: '#end_date', //指定元素
                    min: value,
                    max: '<?php echo date("Y-m-d");?>',
                });
            },
        });
        laydate.render({
            elem: '#end_date', //指定元素
            max: '<?php echo date("Y-m-d");?>',
        });

        form.on('select(refresh)', function (data) {
            if (crontable_id) {
                window.clearInterval(crontable_id);
            }
            if (data.value) {
                crontable_id = window.setInterval("formSubmit(1)", data.value * 1000);
            }
        });

        form.on('select(yuyin)', function (data) {
            if (data.value == 1) {
                yuyin = 1;
            } else {
                yuyin = 0;
            }
        });

        $("#submit").click(function () {
            formSubmit(1);
        });
    });

    formSubmit(1);

    /*提交*/
    function formSubmit(pageindex) {
        $.ajax({
            type: "GET", //请求方式
            url: "/admin/question/index", //请求地址
            dataType: "json", //返回的数据类型
            data: $("#sbumitForm").serialize() + "&pageindex=" + pageindex, //数据
            //请求成功
            success: function (data) {
                if (data.code == 0) {
                    var list = data.data.list;
                    var htmlStr = '';
                    var pageHtml = '';
                    var audio = 0;
                    for (var i = 0; i < list.length; i++) {
                        var reason = '';
                        if (list[i]['reason']) {
                            reason = list[i]['reason'];
                        }

                        var content = ''
                        var nick_name = '';
                        if (list[i]['user'] && list[i]['user']['nick_name']) {
                            nick_name = list[i]['user']['nick_name'];
                        }
                        for (var x in list[i]['content']) {
                            content +=  ' <strong>' + list[i]['content'][x] + '</strong>' + ' & ' ;
                        }

                        var status = '待审核';
                        var style = 'class="myTable"';
                        if (list[i]['status'] ==2) {
                            status = '已审核';
                            status = '<font style="color: #1E9FFF">已审核</font>';
                            style = '';
                        }

                        if (list[i]['status'] == 3) {
                            status = '<font style="color: red">已拒绝</font>';
                            style = '';
                        }

                        if (list[i]['status'] == 4) {
                            status = '<font style="color: red">已删除</font>';
                            style = '';
                        }

                        var btn = '';
                        if (list[i]['status'] == 1) {
                            audio = 1;
                            btn = '<a href="javascript:;"  class="layui-btn layui-btn-xs" onclick="audit_a(\'' + list[i]['id'] + '\')">通过</a>';
                            btn += '<a href="javascript:;" class="layui-btn layui-btn-danger layui-btn-xs" onclick="audit_b(' + list[i]['id']+ ')">拒绝</a>';
                        }
                        htmlStr += '<tr ' + style + '>';
                        htmlStr += '<td style="font-size:12px;text-align: center">' + (i + 1) + '</td>';
                        htmlStr += '<td style="font-size:12px;text-align: center">' + list[i]['create_time'] + '</td>';
                        htmlStr += '<td style="font-size:12px;text-align: center">' + nick_name + '</td>';
                        htmlStr += '<td style="font-size:12px;text-align: left">' + list[i]['title'] + content.substring( 0, content.length - 2) + '</td>';
                        htmlStr += '<td style="font-size:12px;text-align: center">' + list[i]['match_title'] + '</td>';
                        htmlStr += '<td style="font-size:12px;text-align: center">' + list[i]['min_bet'] + '</td>';
                        htmlStr += '<td style="font-size:12px;text-align: center">' + status + '</td>';
                        htmlStr += '<td style="font-size:12px;text-align: center">' + reason + '</td>';
                        htmlStr += '<td style="font-size:12px;text-align: center">' + list[i]['operator'] + '</td>';
                        htmlStr += '<td style="font-size:12px;text-align: center">' + btn + '</td></tr>';
                    }

                    if (htmlStr == '') {
                        htmlStr = '<tr><td colspan="10" style="text-align: center;color:red;font-size:16px">查无数据</td></tr>';
                    }

                    $("#orderidlist").html(htmlStr);
                    $("#pageHtml").html('');
                    page_nav(data.data);
                    if (audio && yuyin) {
                        var strAudio1 = "<audio id='audioPlay1' src='/static/634.wav' hidden='true' autoplay='autoplay' />";
                        $( "body" ).append( strAudio1 );
                        var audio1 = document.getElementById( "audioPlay1" );
                        audio1.play();
                    }
                } else {
                    var htmlStr = '<tr><td colspan="10" style="text-align: center;color:red;font-size:14px">' + data.msg + '</td></tr>';
                    $("#orderidlist").html(htmlStr);
                    $("#pageHtml").html('');
                }
            },
            //请求失败，包含具体的错误信息
            error: function (e) {
                console.log(e);
                var htmlStr = '<tr><td colspan="10" style="text-align: center;color:red;font-size:14px">查询错误</td></tr>';
                $("#orderidlist").html(htmlStr);
                $("#pageHtml").html('');
            }
        })
    }

    function page_nav(results) {
        var disabled = '';
        if (results.pageCount > 1) {
            var pageHtml = '<div class="layui-box layui-laypage layui-laypage-default" id="layui-laypage-1">';
            if (results.pageCount > 1 && results.pageIndex > 1) {
                pageHtml += '<a href="javascript:;" lass="layui-laypage-prev layui-disabled" onclick="formSubmit(1)" ><i class="layui-icon"></i></a>';
            }

            for (var i = 0; i < results.pageNav.length; i++) {
                if (results.pageNav[i] == results.pageIndex) {
                    pageHtml += '<span class="layui-laypage-curr"><em class="layui-laypage-em"></em><em>' + results.pageNav[i] + '</em></span>';
                } else {
                    pageHtml += '<a href="javascript:;" onclick="formSubmit(' + results.pageNav[i] +')">' + results.pageNav[i] + '</a>';
                }
            }
            if (results.pageIndex != results.pageCount) {
                pageHtml += '<a href="javascript:;"class="layui-laypage-next" onclick="formSubmit(' + results.pageCount + ')"><i class="layui-icon"></i></a>';
            } else {
                pageHtml += '<a href="javascript:;"class="layui-laypage-next layui-disabled" ><i class="layui-icon"></i></a>';
            }

            pageHtml += '<span class="layui-laypage-count">共 ' + results.count + '条记录</span>'
            pageHtml += '<span class="layui-laypage-limits"><select lay-ignore name="pagesize" onchange="formSubmit(1)" id="pagesize"  style="border: 0">';
            pageHtml += '<option value="20">20 条/页</option>';
            pageHtml += '<option value="50">50 条/页</option>';
            pageHtml += '<option value="100">100 条/页</option>';
            pageHtml += '<option value="200">200 条/页</option>';
            pageHtml += '<option value="500">500 条/页</option></select></span></div>';
            $("#pageHtml").html(pageHtml);
            $("#pagesize option").each(function () {
                if ($(this).val() == results.pageSize) {
                    $(this).prop("selected", true)
                }
            });
        }
    }

    function audit_a(id) {
        layer.confirm('确认通过吗？', function (index) {
            $.ajax({
                type: "POST",//请求方式
                url: "/admin/question/audit", //请求地址
                dataType: "json",//返回的数据类型
                data: {"id": id, "status": 2},
                //请求成功
                success: function (data) {
                    if (data.code == 0) {
                        layer.msg(data.msg, {icon: 1, time: 2000}, function () {
                            window.location.reload();
                        });
                    } else {
                        layer.msg(data.msg, {icon: 2});
                    }
                },
                //请求失败，包含具体的错误信息
                error: function (e) {
                }
            });
        });
    }

    function audit_b(id) {
        var html = '<div style="text-align:center;">'
            + '<form action="" method="post" id="budanfrom">'
            + '<input type="hidden" class="form-control" name="id" value="">'
            + '<textarea name="xxx" class="layui-textarea" id="reason" style="height: 80px;text-align: left;resize: none" maxlength="200" placeholder="请输入拒绝理由 200字以内"></textarea>'
            + '</form>'
            + '</div>';
        layer.confirm(html, {area: ['380px', '260px'], title: '提示'}, function (index) {
            $.ajax({
                type: "POST",//请求方式
                url: "/admin/question/audit", //请求地址
                dataType: "json",//返回的数据类型
                data: {"id": id, "reason": $("#reason").val(), "status": 3},
                //请求成功
                success: function (data) {
                    if (data.code == 0) {
                        layer.msg(data.msg, {icon: 1, time: 2000}, function () {
                            window.location.reload();
                        });
                    } else {
                        layer.msg(data.msg, {icon: 2});
                    }
                },
                //请求失败，包含具体的错误信息
                error: function (e) {
                }
            });
        });
    }
</script>